<template>
  <view class="contenter">
    <view class="head">
      <view class="head-top">
        <store-change></store-change>
      </view>
      <indextime :Show="false"  @time="time"></indextime>
    </view>
    <view class="content">
      <view class="u-flex tabs">
        <view class="tab" @click="tabChangeIndex(index)" :class="{'active':index == tabIndex}" v-for="(data,index) in tab" :key="index">{{data}}</view>
      </view>
      <!--内容-->
      <scroll-view  scroll-y="true" class="scroll-Y" @scrolltolower="onReachBottom" >
        <view v-for="(data,index) in list"  :key="index">
          <feed-item :item="data"></feed-item>
        </view>
        <view class="loading_text">
          <text>{{loadingText}}</text>
        </view>
      </scroll-view>
    </view>
  </view>
</template>

<script>
import Indextime from "../../components/index/indexTime";
import StoreChange from "../../components/item/storeChange";
import FeedItem from "../../components/feedBack/feedItem";
export default {
name: "feedback",
  components: {FeedItem, StoreChange, Indextime},
  data(){
    return{
      tab:['已处理','未处理'],
      tabIndex:-1,
      loadingText:'',
      list:[],
      allpage:'',
      page:1,
      form:{
        start_time:'',//
        end_time:'',//
      },
      type :'',//1-已处理2-未处理 （不填显示全部）
    }
  },
  onLoad(){
    this.NewDay()//请求今日
    this.setData()
  },
  methods:{
  //时间选择
    time(time){
      this.form.start_time = time.start_time
      this.form.end_time = time.end_time
      this.page = 1
      this.loadingText = ''
      this.list = []
      this.setData()
    },
    setData(){
      let form = {
        store_id:  uni.getStorageSync('store').id,
        type:this.type,
        start_time:this.form.start_time ,
        end_time:this.form.end_time ,
        limit:10,
        page:this.page || 1
      }
      let that = this
      this.$api.complaint(form).then(res => {
        this.allpage = res.data.last_page
        that.list = [...that.list,...res.data.data]
      })
    },
    tabChangeIndex(index){
      this.page = 1
      this.loadingText = ''
      this.list = []
      this.tabIndex = index
      this.type = index +1
      this.setData()
    },
    //上拉加载
    onReachBottom(){
      if(this.page>=this.allpage){
        this.loadingText="已经到底啦！"
        return ;
      }else{
        this.loadingText = '加载中....'
      }
      this.page ++
      this.setData()
    },

  }
}
</script>

<style scoped lang="scss">
.head-top{
  background: white;
  padding: 20rpx 0 ;
  border-bottom: 2rpx solid $uni-border-color;
}
.content{
  .tabs{
    padding: 32rpx;
    .tab{
      width: 160rpx;
      height: 62rpx;
      background: #FFFFFF;
      border: 2rpx solid $uni-border-color;
      border-radius: 12rpx;
      align-items: center;
      justify-content: center;
      display: flex;
      margin-right: 30rpx;
      font-size: 28rpx;
      font-weight: bold;
      color: $uni-text-color;
    }
    .active{
      background: rgba(232, 104, 35, 0.2);
      border: 2rpx solid $uni-color-price;
      color: $uni-color-price;
    }
  }


}

</style>